<template>
<div :class="$style.search">
        <el-row :class="$style.idinput">
            <el-col :span="12">
            <el-input  v-model="goodsid" placeholder="请输入内容"  @keyup.enter.native="ckeck" clearable ></el-input>
            
            </el-col>
            <el-col :span="12"><el-button type="primary" @click="ckeck" icon="el-icon-search">搜索</el-button></el-col>
        </el-row>
        <div class="goods">
          <el-dialog title="货品搜寻结果" :visible.sync="dialogTableVisible" >
            <goodstable :tableData="goodstableData" :tableKey="goodstableKey" v-on:listenTochose="showchosegoodsid"></goodstable>
            </el-dialog>
        </div>
        <div :class="$style.goodsinfocard">
            <el-card class="box-card">
              <div slot="header" class="clearfix">
                <span>货品概述</span>
              </div>
              <div :class="$style.c2017">
                <el-tag type="success">2017挂网价:</el-tag><span>{{ price2017 }}</span>
              </div>
              <div :class="$style.cGoodsqty">
                  <Panel title="近效期库存信息" :class="$style.panel">
                    <slTable :tableData="lastqtytableData" :tableKey="lastqtytableKey"></slTable>
                </Panel>
              </div>
            </el-card>
        </div>
        <div :class="$style.showdata">
                <Panel title="货品基础信息" :class="$style.panel">
                    <slTable :tableData="tableData" :tableKey="tableKey"></slTable>
                </Panel>
                <panel title="库存信息" :class="$style.panel">
                    <slTable :tableData="stocktableDate" :tableKey="stocktableKey"></slTable>
                </panel>
                <panel title="价格信息" :class="$style.panel">
                    <slTable :tableData="pricetableDate" :tableKey="pricetableKey"></slTable>
                </panel>
                <panel title="进货信息" :class="$style.panel">
                    <slTable :tableData="sutableDate" :tableKey="sutableKey"></slTable>
                </panel>
                <panel title="销售信息" :class="$style.panel">
                    <slTable :tableData="satableDate" :tableKey="satableKey"></slTable>
                </panel>
        </div>
</div>
</template>
<script>
import simpletable from "@/components/avgtable/simpletable.vue";
import goodstable from "@/components/Goodssearchtable/Goodssearchtable.vue";
import Panel from "@/components/panel.vue";
import { Loading } from "element-ui";
import { reqgoods, reqsugoods, reqsagoods,reqstockgoods,reqpricegoods } from "@/api";
export default {
  components: {
    Panel,
    slTable: simpletable,
    goodstable
  },
  data() {
    return {
      goodsid: "",
      goodstype: "num",
      price2017: ' ',
      dialogTableVisible: false,
      ok: false,
      goodstableData: [],
      goodstableKey: [],
      stocktableDate: [],
      lastqtytableData: [],
      lastqtytableKey: [
         {
          name: "批号",

          value: "lotno"
        },
        {
          name: "有效期至",

          value: "invaliddate"
        },
        {
          name: "数量",

          value: "goodsqty"
        }
      ],

      stocktableKey: [
        {
          name: "批号",

          value: "lotno"
        },
        {
          name: "生产日期",

          value: "proddate"
        },
        {
          name: "有效期至",

          value: "invaliddate"
        },
        {
          name: "数量",

          value: "goodsqty"
        },
        {
          name: "包装大小",

          value: "packsize"
        },
        {
          name: "包装单位",

          value: "packname"
        },
        {
          name: "货品状态",

          value: "goodsstatus"
        },
        {
          name: "批次价",

          value: "unitprice"
        },
      ],
      tableData: [],
      tableKey: [
        {
          name: "货品id",

          value: "goodsid"
        },
        {
          name: "货品名称",

          value: "goodsname"
        },
        {
          name: "单位",

          value: "goodsunit"
        },
        {
          name: "规格",

          value: "goodstype"
        },
        {
          name: "生产厂家",

          value: "factoryname"
        }
      ],
      sutableKey: [
        {
          name: "进货日期",

          value: "credate"
        },
        {
          name: "供应商",

          value: "supplyname"
        },
        {
          name: "批号",

          value: "lotno"
        },
        {
          name: "数量",

          value: "goodsqty"
        },
        {
          name: "有效期至",

          value: "invaliddate"
        },
        {
          name: "价格",

          value: "unitprice"
        }
      ],
      sutableDate: [],
      satableKey: [
        {
          name: "销售",

          value: "credate"
        },
        {
          name: "客户",

          value: "customname"
        },
        {
          name: "批号",

          value: "lotno"
        },
        {
          name: "数量",

          value: "goodsqty"
        },
        {
          name: "有效期至",

          value: "invaliddate"
        },
        {
          name: "价格",

          value: "unitprice"
        }
      ],
      satableDate: [],
      pricetableKey: [
        {
          name: "价格类型",

          value: "pricename"
        },
        {
          name: "价格",

          value: "price"
        }
      ],
      pricetableDate: []
    };
  },
  methods: {
    ckeck: function() {
      const entextre = /[A-Za-z]+/;
      const numtextre = /^(([1-9]+[0-9]*.{1}[0-9]+)|([0].{1}[1-9]+[0-9]*)|([1-9][0-9]*)|([0][.][0-9]+[1-9]*))$/; //只能为正数
      const chinatextre = /[^\x00-\x80]/g;
      const zh_reg = /^[\u4e00-\u9fa5]+$/; //只能为汉字
      // console.log(this.goodsid)
      // console.log('数字结果',numtextre.test(this.goodsid))
      // console.log(this.goodsid, '中文结果',chinatextre.test(this.goodsid))
      // console.log(this.goodsid, 'en结果',entextre.test(this.goodsid))
      if (this.goodsid === "") {
        this.$message.error("不允许输入空值");
        return;
      }
      if (numtextre.test(this.goodsid)) {
        // this.$message("现在查询的数字");
        this.searchData(this.goodsid);
        return;
      } else if (chinatextre.test(this.goodsid)) {
        this.goodstype = "cn";
        this.searchgoods(this.goodsid, "cn");
      } else {
        this.goodstype = "en";
        this.searchgoods(this.goodsid, "en");
      }
    },
    showchosegoodsid: function(data) {
      console.log(data);
      this.goodstype = 'num'
      this.searchData(data);
      this.dialogTableVisible = false;
      return;
    },
    searchgoods: async function name(params, goodstype) {
      // this.$message('要查找' + params + goodstype)
      const ret = await reqgoods({
        goodsid: params,
        goodstype: goodstype
      });
      if (ret.status == "True") {
        // console.log("开始查询" + params + goodstype);
        this.goodstableData = [];
        for (var i in ret.data) {
          this.goodstableData.push(ret.data[i]);
        }
        this.dialogTableVisible = true;
        this.goodsid = "";
      } else {
        this.$message.error(this.goodsid + " 确定有这个货品？");
      }
    },
    searchData: async function(reqgoodsid) {
      try {
        const loading = this.$loading({
          lock: true,
          text: reqgoodsid + "查询进行中",
          spinner: "el-icon-loading",
          background: "rgba(0, 0, 0, 0.7)"
        });
        // let loadingInstance1 = Loading.service({ fullscreen: true });
        // this.$message("开始查询 "+ this.goodsid);
        const ret = await reqgoods({
          goodsid: reqgoodsid,
          goodstype: this.goodstype
        });
        const retsu = await reqsugoods({
          goodsid: reqgoodsid
        });
        const retsa = await reqsagoods({
          goodsid: reqgoodsid
        });
        const retstock = await reqstockgoods({
          goodsid: reqgoodsid
        });
        const retprice = await reqpricegoods({
          goodsid: reqgoodsid
        });
        if (ret.status == "True") {
          // console.log("开始查询");
          this.tableData = [];
          for (var i in ret.data) {
            this.tableData.push(ret.data[i]);
          }
          this.ok = true;
          this.goodsid = "";
        }
        // 库存查询结果
        if (retstock.status == "True") {
          // console.log("开始查询");
          this.stocktableDate = [];
          this.lastqtytableData = [];
          for (var i in retstock.data) {
            this.stocktableDate.push(retstock.data[i]);
          }
          for (var i in retstock.last_qty) {
            this.lastqtytableData.push(retstock.last_qty[i]);
            break;
          }
        }
        // 价格查询结果
        if (retprice.status == "True") {
          // console.log("开始查询");
          this.pricetableDate = [];
          for (var i in retprice.data) {
            this.pricetableDate.push(retprice.data[i]);
          }
          this.price2017 = retprice.price2017[0].price
        }
        if (retsu.status == "True") {
          // console.log("开始查询进货");
          this.sutableDate = [];
          for (var i in retsu.data) {
            this.sutableDate.push(retsu.data[i]);
          }
        }
        if (retsa.status == "True") {
          // console.log("开始查询进货");
          this.satableDate = [];
          for (var i in retsa.data) {
            this.satableDate.push(retsa.data[i]);
          }
        }
        // loadingInstance1.close()
        // this.$loading.close()
        loading.close();
      } catch (err) {
        this.$message.error(reqgoodsid + " 查询出错!");
      }
    }
  }
};
</script>

<style lang="scss" module>
@import "../../styles/element.scss";
.search {
  width: 100%;
  .idinput {
    width: 50%;
  }
  .goodsinfocard {
    width: 50%;
    margin-top: 10px;
    .c2017 {
      float: right;
    }
  }
  .showdata {
    margin: 10px auto;
  }
  .tag {
    float: left;
    margin: 10px;
  }
  .panel {
    @include panel;
  }
}
</style>
